<template>
  <a-card>
  <a-form>
    <a-form-item label="姓名" >
      <a-input v-model:value="currentUser.userName"/>
    </a-form-item>
    <a-form-item label="账号" >
      <a-input v-model:value="currentUser.userAccount"/>
    </a-form-item>
    <a-form-item label="性别">
      <a-select v-model:value="currentUser.gender" placeholder="选择你的性别">
        <a-select-option value="0">男</a-select-option>
        <a-select-option value="1">女</a-select-option>
      </a-select>
    </a-form-item>
    <a-form-item label="头像" >
      <a-input v-model:value="currentUser.userAvatar"/>
    </a-form-item>
    <a-form-item :wrapper-col="{ span: 14, offset: 4 }">
      <a-button type="primary" @click="onSubmit">提交</a-button>
      <a-button style="margin-left: 10px" @click="resetForm">取消</a-button>
    </a-form-item>
  </a-form>
</a-card>
</template>
<script lang="ts" setup>
import { Dayjs } from 'dayjs';
import { reactive, ref, toRaw ,onMounted} from 'vue';
import axios from '../config/axios'
import {useRoute,useRouter} from 'vue-router'
import { message } from 'ant-design-vue';
const route = useRoute()
const router = useRouter()
const id = route.query.id

const currentUser = ref({
  userName:''
})
const userForm = ref()

onMounted(()=>{
  getCurrentUser()
})

const getCurrentUser = async()=>{
  const res = await axios.get('/user/get',{
    params:{
    id:id
  }})
  currentUser.value = res.data.data
  console.log(currentUser.value);
}

const getGender = (index)=>{
  if(index===0) return '男'
  else return '女'
}


const onSubmit = () => {

  const res =axios.post('user/update',currentUser.value)
  message.success("修改成功")
  router.back()
  
};
const resetForm = () => {
  router.back()
};
</script>

